<template>
  <div class="order">
    <div class="header">
      <div class="left"></div>
      <div class="right">生成订单</div>
    </div>

    <div class="order-main">
      <FormDataCard @addAddress="addAddress"></FormDataCard>

      <OrderContent></OrderContent>
    </div>

    <div class="footer">
      <el-button>取消</el-button>
      <el-button>提交</el-button>
    </div>

    <EditAddress ref="editAddress"></EditAddress>
  </div>
</template>

<script>
import FormDataCard from "./components/FormDataCard.vue";
import EditAddress from "@/views/system/addressManagement/components/EditAddress.vue";
import OrderContent from "./components/OrderContent.vue";
export default {
  components: {
    FormDataCard,
    EditAddress,
    OrderContent,
  },
  data() {
    return {};
  },
  methods: {
    addAddress() {
      this.$refs.editAddress.open(0, 1);
    },
  },
  created() {},
};
</script>
<style lang="scss" scoped>
.order {
  .header {
    display: flex;
    margin-bottom: 20px;
    .left {
      background-color: #442a8d;
      width: 5px;
      height: 20px;
      margin-right: 5px;
    }
    .right {
      font-weight: 650;
      color: #666666;
      font-size: 16px;
    }
  }

  .footer {
    display: flex;
    justify-content: center;
    button {
      width: 120px;
    }
    :nth-child(2) {
      background-color: #442a8d;
      color: #ffffff;
    }
  }
}
</style>
